
<style type="text/css">
    /*reset nativi style*/
    .modal{
        top: 130px;
        background-color: #8d8d8d;
    }
    .modal-backdrop{
        background-color: rgba(0, 0, 0, 0.5);
    }
    .bar-footer {
        bottom: 82px;
        padding: 0;
    }
    .wap3-xtzg-filter.has-footer {
        bottom: 110px;
    }
    .buttons{
        background-color: #f93841;
        border-color: #f93841;
    }
    .buttons>button{
        width: 100%
    }
    .wap3-bar .buttons > .button{
        line-height: 0px;
    }
    /*reset nativi style end*/
    .wap3-filter{
        background-color: #fff;

    }
    .wap4-filter .scroll-view.scroll-y{
        overflow: hidden;
        margin-top: 0;
    }

    .wap3-head{
        padding: 20px 0px 0px 20px;
        color: #666;
    }
    .wap3-head>span{
        color: #ff5000;
    }
    .wap3-row{
        padding: 12px 12px 15px 12px;
        border-bottom: 1px solid #dbdbdb;

    }
    .wap3-radio{
        float: left;
        height: 20px;
        line-height: 0;
        position: relative;
        padding: 12px;
        border-radius: 26px;
        border: 1px solid #ddd;
        margin: 5px;

    }
    .wap3-radio>input{
        position: absolute;
        left: 0;
        width: 100%;
        display: block;
        height: 100%;
        opacity: 0;
        top: 0;


    }

    .wap4-filter-left{
        height: 60px;
        line-height: 60px;
        background-color: #F5F5F5;
        border: 1px solid #E8E8E8;
        text-align: center;
        color: #333333;
        font-size: 18px;
    }

    .wap4-filter-left-div{
        background-color: #f5f5f5;
        border: 1px solid #E8E8E8;
    }
    .wap4-filter-left .wap3-sleON{
        background-color: #ffffff;
        border:none;
    }

</style>
<div style="background-color: rgba(0, 0, 0, 0.3);height: 170px" ng-click="closeFilter(5)"></div>
<ion-modal-view>
    <ion-content  class="wap3-xtzg-filter bg-fff">
        <div class="wap3-filter wap4-filter">
            <div class="row" style="background-color: #FF971B;color: #fff;">
                <div class="col text-left" ng-click="closeFilter(5)">取消</div>
                <div class="col text-center" ng-click="zaiquanfilter.clearFilter()">
                    <div style="background-color: #E08416;padding: 5px;
    border-radius: 2px;">清空筛选</div>
                </div>
                <div class="col text-right" ng-click="zaiquanfilter.done()">确定</div>
            </div>
            <div class="row row-no-padding">

                <div class="col col-40 wap4-filter-left " ng-init="selData.wap4SleLeft=0">
                    <ion-scroll    delegate-handle="filterss1Scroll"  style="height: 400px;margin-right: -1px">
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 0}" ng-click="ngWap4SleLeft(0)">募集状态</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 1}" ng-click="ngWap4SleLeft(1)">产品期限</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 2}" ng-click="ngWap4SleLeft(2)">预期收益</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 3}" ng-click="ngWap4SleLeft(3)">付息方式</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 4}" ng-click="ngWap4SleLeft(4)">投资领域</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 5}" ng-click="ngWap4SleLeft(5)">起购金额</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 6}" ng-click="ngWap4SleLeft(6)">大小配比</div>
                        <div class="wap4-filter-left-div" ng-class="{'wap3-sleON':selData.wap4SleLeft == 7}" ng-click="ngWap4SleLeft(7)">所在地区</div>
                    </ion-scroll>
                </div>


                <div class="col col-60 wap4-filter-right">
                    <ion-scroll    delegate-handle="filterRightScroll" style="height: 400px"  class="">

                        <!--募集状态-->
                        <ion-list ng-show="selData.wap4SleLeft==0">
                            <ion-radio ng-model="product.three.data.saleStatus" name="muji" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.saleStatus" name="muji" value="02" >预热中</ion-radio>
                            <ion-radio ng-model="product.three.data.saleStatus" name="muji" value="03" >募集中</ion-radio>
                            <ion-radio ng-model="product.three.data.saleStatus" name="muji" value="04" >本期募满</ion-radio>
                            <ion-radio ng-model="product.three.data.saleStatus" name="muji" value="05" >募集结束</ion-radio>
                        </ion-list>
                        <!--产品期限-->
                        <ion-list ng-show="selData.wap4SleLeft==1">
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="07" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="02" >12个月以内</ion-radio>
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="03" >12个月</ion-radio>
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="04" >13-23个月</ion-radio>
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="05" >24个月</ion-radio>
                            <ion-radio ng-model="product.three.data.dueTime" name="qixian" value="06" >24个月以上</ion-radio>
                        </ion-list>
                        <!--预期收益-->
                        <ion-list ng-show="selData.wap4SleLeft==2">
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="01" >7%以内</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="02" >7%(包含)-8%</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="03" >8%(包含)-9%</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="04" >9%(包含)-10%</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="05" >10%及以上</ion-radio>
                            <ion-radio ng-model="product.three.data.annualRevenue" name="yqsy" value="06" >浮动</ion-radio>
                        </ion-list>
                        <!--付息方式-->
                        <ion-list ng-show="selData.wap4SleLeft==3">
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="01" >按月付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="02" >按季付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="03" >按半年付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="04" >按年付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="05" >到期付本息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="06" >按自然半年付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="07" >按顺延半年付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="08" >按自然季度付息</ion-radio>
                            <ion-radio ng-model="product.three.data.pPaymentInterestType" name="fxfs" value="09" >按顺延季度付息</ion-radio>
                        </ion-list>
                        <!--投资领域-->
                        <ion-list ng-show="selData.wap4SleLeft==4">
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="01" >房地产类</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="02" >金融市场</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="03" >基础设施</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="07" >资金池</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="06" >工商企业</ion-radio>
                            <ion-radio ng-model="product.three.data.pInvestType" name="tzly" value="04" >其他</ion-radio>
                        </ion-list>
                        <!--起购金额-->
                        <ion-list ng-show="selData.wap4SleLeft==5">
                            <ion-radio ng-model="product.three.data.minimumAmount" name="qgje" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.minimumAmount" name="qgje" value="500000" >50万以上</ion-radio>
                            <ion-radio ng-model="product.three.data.minimumAmount" name="qgje" value="1000000" >100万以上</ion-radio>
                            <ion-radio ng-model="product.three.data.minimumAmount" name="qgje" value="2000000" >200万以上</ion-radio>
                            <ion-radio ng-model="product.three.data.minimumAmount" name="qgje" value="3000000" >300万以上</ion-radio>
                        </ion-list>
                        <!--大小配比-->
                        <ion-list ng-show="selData.wap4SleLeft==6">
                            <ion-radio ng-model="product.three.data.pSizeRatioType" name="dxpb" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.pSizeRatioType" name="dxpb" value="01" >小额畅打</ion-radio>
                            <ion-radio ng-model="product.three.data.pSizeRatioType" name="dxpb" value="02" >已配出小额</ion-radio>
                            <ion-radio ng-model="product.three.data.pSizeRatioType" name="dxpb" value="03" >严格配比</ion-radio>
                            <ion-radio ng-model="product.three.data.pSizeRatioType" name="dxpb" value="04" >全大额</ion-radio>
                        </ion-list>
                        <!--所在地区-->
                        <ion-list ng-show="selData.wap4SleLeft==7">
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="" >不限</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="01" >北京</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="02" >天津</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="03" >上海</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="04" >河北</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="05" >广东</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="06" >浙江</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="07" >江苏</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="08" >重庆</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="09" >山东</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="10" >福建</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="11" >江西</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="12" >内蒙古</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="13" >辽宁</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="14" >吉林</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="15" >黑龙江</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="16" >安微</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="17" >山西</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="18" >河南</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="19" >湖北</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="20" >湖南</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="21" >广西</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="22" >海南</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="23" >四川</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="24" >贵州</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="25" >云南</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="26" >西藏</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="27" >陕西</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="28" >甘肃</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="29" >青海</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="30" >宁夏</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="31" >新疆</ion-radio>
                            <ion-radio ng-model="product.three.data.pBelongArea" name="szdq" value="00" >其他</ion-radio>
                        </ion-list>
                        <!--</div>-->
                    </ion-scroll>

                </div>
            </div>

        </div>

    </ion-content>

</ion-modal-view>
